/* 引入less */
/* 重置样式 */
require('../css/commCss/normalize.css')
/* 重置样式补充 */
require('../css/commCss/reset.css')
/* 公共样式 */
require('../css/commCss/property.css')
/* 公共属性 */
require('../css/commCss/basic.less')
/* 字体图标 */
require('../fonts/iconfont.css')
/* 当前页面 */
require('../css/circle.less')
require('weui')


document.addEventListener('DOMContentLoaded', function () {

  const util = require('../util/util')
  const weui = require('weui.js')

  /**
   * @tabCard : 选项卡
   * @param {*} menuClassName  : 选项卡菜单的类选择器
   * @param {*} textClassName  : 选项卡内容的类选择器
   */
  function tabCard(menuClassName, textClassName) {
    let menu = document.querySelectorAll(menuClassName)
    let text = document.querySelectorAll(textClassName)

    //定义变量保存上一个菜单的索引
    let index = 0;

    menu.forEach(function (v, i) {
      v.addEventListener('mouseover', function () {

        //先清除上一个菜单的激活样式
        menu[index].className = ''

        //给当前添加激活样式
        this.className = 'menu-active'


        //先隐藏其他内容
        text[index].classList.remove('on')

        //显示当前菜单对应的内容
        text[i].classList.add('on')


        //将当前菜单的索引赋值给index
        index = i

      })
    })

  }

  tabCard('#menuBox p', '#menuContent li')

  /**
   * 2. 底部导航栏
   */
  util.utilBottomNav('circle', 'app-circle')


  /* 添加按钮跳转 */
  document.querySelector("#jumpBtn").addEventListener("click",function(){
    location.href = "./dynamic.html"
  })
})